<template>
	<view :class="['page',{'iphoneX':isIphoneX}]"> 
		<template v-if="isLogin">
			<template v-if="loadingStatus.default">
				<loading :loadingState="loadingStatus"></loading>
			</template>
			
			<template v-else>
			<view class="body">
				<view class="form-wrap m-b2"> 
					<view class="form-item">
						<view class="label" style="width: 25%;">上报类型：</view>
						<picker class="form-picker" mode="selector" disabled>
							<view class="picker">
								<input type="text" class="select-data t-r" v-model="params.type" placeholder="选择上报类型" disabled> 
								<view class="icon">
									<view class="iconfont f-s68">&#xeb8a;</view>
								</view>
							</view>
						</picker>
					</view>
					<!-- 上报时间 -->
					<view class="form-item">
						<view class="label" style="width: 25%;">上报时间：</view>							
						<picker class="form-picker" mode="selector" disabled>
							<view class="picker">
								<input type="text" class="select-data t-r" v-model="params.date" placeholder="选择上报月份" disabled> 
								<view class="icon">
									<view class="iconfont f-s68">&#xeb8a;</view>
								</view>
							</view>
						</picker> 
					</view>			
				</view> 
				<view class="form-wrap">
					<template>
						<view class="form-item">
							<view class="label">一级发生面积：</view>
							<view class="form-input">
								<view class="content">
									<input type="digit" class="inp" v-model="params.fs_area_one" placeholder="输入一级发生面积" />
									<view class="link">亩</view>
								</view>
							</view>
						</view> 
					</template>

					<template>
						<view class="form-item">
							<view class="label">二级发生面积：</view>
							<view class="form-input">
								<view class="content">
									<input type="digit" class="inp" v-model="params.fs_area_two" placeholder="输入二级发生面积" />
									<view class="link">亩</view>
								</view>
							</view>
						</view> 
					</template>

					<template>
						<view class="form-item">
							<view class="label">三级发生面积：</view>
							<view class="form-input">
								<view class="content">
									<input type="digit" class="inp" v-model="params.fs_area_thr" placeholder="输入三级发生面积" />
									<view class="link">亩</view>
								</view>
							</view>
						</view> 
					</template>

					<template>
						<view class="form-item">
							<view class="label">四级发生面积：</view>
							<view class="form-input">
								<view class="content">
									<input type="digit" class="inp" v-model="params.fs_area_for" placeholder="输入四级发生面积" />
									<view class="link">亩</view>
								</view>
							</view>
						</view> 
					</template>

					<template>
						<view class="form-item">
							<view class="label">五级发生面积：</view>
							<view class="form-input">
								<view class="content">
									<input type="digit" class="inp" v-model="params.fs_area_fiv" placeholder="输入五级发生面积" />
									<view class="link">亩</view>
								</view>
							</view>
						</view> 
					</template>

					<template>
						<view class="form-item">
							<view class="label">防控面积：</view>
							<view class="form-input">
								<view class="content">
									<input type="digit" class="inp" v-model="params.fk_area" placeholder="输入防治面积" />
									<view class="link">亩</view>
								</view>
							</view>
						</view> 
					</template>

					<template>
						<view class="form-item">
							<view class="label">投入药剂：</view>
							<view class="form-input">
								<view class="content">
									<input type="digit" class="inp" v-model="params.yj_total" placeholder="输入投入药剂" />
									<view class="link">公斤</view>
								</view>
							</view>
						</view> 
					</template>

					<template>
						<view class="form-item">
							<view class="label">监测防控人次：</view>
							<view class="form-input">
								<view class="content">
									<input type="number" class="inp" v-model="params.jcfk_total" placeholder="输入监测防控人次" />
									<view class="link">人次</view>
								</view>
							</view>
						</view> 
					</template>

					<view class="form-item">
						<view class="label a-t">备注：</view>
						<view class="form-textarea">
							<textarea class="inp-textarea" v-model="params.remark" placeholder="输入备注信息" maxlength="-1"></textarea>
						</view>
					</view>
				</view>

			</view>

			<!-- 底部 -->
			<view class="footer">
				<view class="fix-wrap bottom">
					<view class="btn" @click="submit">保存编辑</view>
				</view>
			</view>
			</template>

		</template>
	</view>
</template>

<script>
	import customHeader from '@/components/custom-header.vue'
	import loading from '@/components/loading-more.vue'
	export default {
		name: 'name',
		data() {
			return {
				isLogin: true,
				isIphoneX: getApp().globalData.isIphoneX,
				isShowPrevData:false,
				isStop:true, 
				id:'',
				loadingStatus:{
					default:true
				},
				detail:{},
				type:0,   // 0  周报  1 月报
				params:{
					type:'1', 
					date:"",
					week_id:'', 
					fs_area_one:'',
					fs_area_two:'',
					fs_area_thr:'',
					fs_area_for:'',
					fs_area_fiv:'',
					fk_area:'',
					yj_total:'',
					jcfk_total:'',
					remark:'', 
					is_month:0     // 1 月报   其他|空  为 周报
				}, 
			}


		},
		async onLoad(params) {
			this.id=params.id;
			this.type=params.type;
			if(this.type==0){
				this.params.is_month=0;
			}else{
				this.params.is_month=1;
			}
			this.isLogin = await this.$loginState('check');	
			if(this.isLogin){
				this.getDetail();
			}
		},
		async onShow() {

		},
		methods: {
			
			// 获取详情
			getDetail:async function(){
				let _this=this;
				let res=await this.$api.ysb_api.getDetail({
					id:this.id 
				}) 
				if(res.data.ret==0){
					this.loadingStatus.default=false;
					this.detail=res.data.data; 
					if(res.data.data.is_month==0){
						this.params.type='周报';
						this.params.date='第'+res.data.data.week_num+'周 ('+res.data.data.week_start+"至"+res.data.data.week_end+')'; 
					}
					this.params.week_id=res.data.data.week_id;
					this.params.fs_area_one=res.data.data.fs_area_one;
					this.params.fs_area_two=res.data.data.fs_area_two;
					this.params.fs_area_thr=res.data.data.fs_area_thr;
					this.params.fs_area_for=res.data.data.fs_area_for;
					this.params.fs_area_fiv=res.data.data.fs_area_fiv;
					this.params.fk_area=res.data.data.fk_area;
					this.params.yj_total=res.data.data.yj_total;
					this.params.jcfk_total=res.data.data.jcfk_total;
					this.params.remark=res.data.data.remark;
				} 
			},      
			
			  
			
			// 提交数据
			submit:async function(){
				let _this=this; 
				 
				if(this.params.fs_area_one==''){
					uni.showToast({
						icon: 'none',
						title: '请输入一级发生面积',
						mask: true,
						duration: 1000
					})
					return
				};
				if(this.params.fs_area_two==''){
					uni.showToast({
						icon: 'none',
						title: '请输入二级发生面积',
						mask: true,
						duration: 1000
					})
					return
				};
				if(this.params.fs_area_thr==''){
					uni.showToast({
						icon: 'none',
						title: '请输入三级发生面积',
						mask: true,
						duration: 1000
					})
					return
				};
				if(this.params.fs_area_for==''){
					uni.showToast({
						icon: 'none',
						title: '请输入四级发生面积',
						mask: true,
						duration: 1000
					})
					return
				};
				if(this.params.fs_area_fiv==''){
					uni.showToast({
						icon: 'none',
						title: '请输入五级发生面积',
						mask: true,
						duration: 1000
					})
					return
				};
				if(this.params.fk_area==''){
					uni.showToast({
						icon: 'none',
						title: '请输入防控面积',
						mask: true,
						duration: 1000
					})
					return
				};
				if(this.params.yj_total==''){
					uni.showToast({
						icon: 'none',
						title: '请输入投入药剂',
						mask: true,
						duration: 1000
					})
					return
				};
				if(this.params.jcfk_total==''){
					uni.showToast({
						icon: 'none',
						title: '请输入监测防控人次',
						mask: true,
						duration: 1000
					})
					return
				};
				
				if(this.isStop){
					this.isStop=false;
					let res=await this.$api.ysb_api.saveEdit({
						id:this.id,
						week_id:this.params.week_id,
						fs_area_one:this.params.fs_area_one,
						fs_area_two:this.params.fs_area_two,
						fs_area_thr:this.params.fs_area_thr,
						fs_area_for:this.params.fs_area_for,
						fs_area_fiv:this.params.fs_area_fiv,
						fk_area:this.params.fk_area,
						yj_total:this.params.yj_total,
						jcfk_total:this.params.jcfk_total,
						remark:this.params.remark,
						is_month:this.params.is_month,
						is_tj:1
					});  
					if(res.data.ret==0){
						uni.showToast({
							icon: 'success',
							title: res.data.message,
							mask: true,
							duration: 1000,
							success() {
								setTimeout(()=>{
									_this.isStop=true;
									uni.navigateTo({ 
										url:'/package_yunshangbao/list/list?type='+_this.type, 
									})
								},300)
							}
						})
					}else{
						uni.showToast({
							image: '../../static/images/error.png',
							title: res.data.message,
							mask: true,
							duration: 1000,
							success() {
								setTimeout(()=>{
									_this.isStop=true;
								})
							}
						})
					}
					
				}
			}

		},
		components: {
			customHeader,
			loading
		},

		computed: {

		},
		watch: {

		}

	}
</script>

<style lang="less">
	.form-wrap .label {
		width: 35%;
	}

	.form-wrap .content .link {
		color: #000;
	}
	.status{
		padding:0 20rpx;
		color:#f00; 
		font-size: 28rpx;
	}
	.btn {
		@h: 80rpx;
		width: 98%;
		margin: 10rpx auto;
		text-align: center;
		height: @h;
		line-height: @h;
		background: linear-gradient(#e96b5c, #ce3c2f);
		border-radius: 10rpx;
		color: #fff;
		font-size: 34rpx;
	}

	.prev-btn {
		text-align: right;
		padding: 20rpx;

		text {
			padding: 4rpx 15rpx;
			background: #ff9600;
			border-radius: 8rpx;
			color: #fff;
			font-size: 32rpx;
		}
	}

	.prev-data {
		padding: 18rpx 10rpx;
		background: #f5f5f5;
		text-align: right;
		color: #999;
		font-size: 28rpx;
		.val {
			color: #333;
		}

		.use-btn {
			color: #d03c30;
		}
	}
</style>
